<template>
  <div class="refine_userlist">
    <h2 class="titleblue">专业救助船舶列表</h2>
    <div class="contant">
      <data-table :page='currentPage' :head="thead" :data="tableData"></data-table>
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage"
        layout="total,prev, pager, next, jumper"
        :total="dataCount"
        background
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import DataTable from '@/components/common/DataTable.vue'
  import * as sosShipService from '@/services/SosShipService.js'

  export default {
    components: {
      'data-table': DataTable
    },
    data: function () {
      return {
        thead: [
          {
            name: '搜救机构',
            prop: 'sosOrg'
          },
          {
            name: '救助力量',
            prop: 'powerType'
          },
          {
            name: '单位',
            prop: 'company'
          },
          {
            name: '电话',
            prop: 'ownerTelephone'
          },
          {
            name: '船名',
            prop: 'shipName'
          },
          {
            name: '航区',
            prop: 'sailingAreaName'
          },
          {
            name: '船舶类型',
            prop: 'shipType'
          },
          {
            name: '船长',
            prop: 'shipWidth'
          },
          {
            name: '总吨',
            prop: 'grossTonnage'
          },
        ],
        tableData: [],
        currentPage: 1,
        currentPages: 1,
        dataCount: 0
      }
    },
    created () {
      this.getAll();
    },methods: {
      async getAll () {
        let resp = await sosShipService.search(this.currentPage-1,'powerType==147')
        //let resp = await sosShipService.search(this.currentPage-1)
        this.dataCount = resp.dataCount
        let temptabledate=resp.data
        if (temptabledate!=null){
          for (let k=0;k<temptabledate.length;k++){
            if (temptabledate[k].powerType==147 || temptabledate[k].powerType=="147"){
              temptabledate[k].powerType="专业救助力量";
            }else if (temptabledate[k].powerType==146 || temptabledate[k].powerType=="146") {
              temptabledate[k].powerType="社会救助力量";
            }
          }
        }
        this.tableData = temptabledate
      },
      handleCurrentChange (val) {
        this.currentPage = val
        this.getAll()
      },
    }
  }
</script>

<style lang='scss'>
  .refine_userlist {
    width: 100%;
    display: inline-block;

    .inlanselect {
      float: left;
      margin-right: 10px;
    }

    .el-tabs {
      width: 100%;
      margin-top: 20px;
      display: inline-block;
    }

    .el-table tr:nth-child(2n) {
      background: #FAFAFA
    }

    .table {
      margin-top: 20px;
    }

    .user-title {
      width: 100%;
      display: inline-block;
    }
  }
</style>
